﻿@using Masuit.Tools.Models
@model PhysicsAddress

@{
    ViewBag.Title = "根据经纬度查询详细地理位置";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<style>
    #allmap {
        height: 900px;
        width: 100%;
    }
</style>
<div class="container">
    <ol class="cd-breadcrumb triangle">
        <li><a asp-controller="Home" asp-action="Index">首页</a></li>
        <li class="current">
            <em>@ViewBag.Title</em>
        </li>
    </ol>
    <ul class="list-group">
        <li class="list-group-item">
            <p class="size24">
                如果你觉得这个工具有用，请 <a asp-controller="Misc" asp-action="Donate">点击这里</a> 支持一下博主！
            </p>
        </li>
    </ul>
    @if (Model?.Status == 0)
    {
        <form method="get" asp-action="Position">
            <div class="row">
                <div class="col-md-5">
                    <div class="input-group">
                        <span class="input-group-addon">经度：</span>
                        <input class="form-control" name="lng" value="@(Model.AddressResult.Location?.Lng)" placeholder="请输入经度值" />
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="input-group">
                        <span class="input-group-addon">纬度：</span>
                        <input class="form-control" name="lat" value="@(Model.AddressResult.Location?.Lat)" placeholder="请输入纬度值" />
                    </div>
                </div>
                <div class="col-md-1">
                    <div class="input-group">
                        <button class="btn btn-info" type="submit">查询</button>
                    </div>
                </div>
            </div>
        </form>
        int count = 0;
        <table class="table table-bordered table-condensed table-hover">
            <tr>
                <td>参考地理位置：</td>
                <td>@Model.AddressResult.FormattedAddress</td>
            </tr>
            <tr>
                <td>标志性商业街：</td>
                <td>@Model.AddressResult.Business</td>
            </tr>
            <tr>
                <td>经纬度：</td>
                <td>(经度：@(Model.AddressResult.Location?.Lng),纬度：@(Model.AddressResult.Location?.Lat))</td>
            </tr>
            @foreach (Pois poi in Model.AddressResult.Pois)
            {
                <tr>
                    <td>参考地理位置@(++count)：</td>
                    <td>@poi.AddressDetail</td>
                </tr>
            }
        </table>

    }
    else
    {
        <form method="get">
            <div class="row">
                <div class="col-md-5">
                    <div class="input-group">
                        <span class="input-group-addon">经度：</span>
                        <input class="form-control" name="lng" placeholder="请输入经度值" />
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="input-group">
                        <span class="input-group-addon">纬度：</span>
                        <input class="form-control" name="lat" placeholder="请输入纬度值" />
                    </div>
                </div>
                <div class="col-md-1">
                    <div class="input-group">
                        <button class="btn btn-info" type="submit">查询</button>
                    </div>
                </div>
            </div>
        </form>
    }
</div>
<div class="container-fluid">
    @if (Model != null && Model.Status == 0)
    {
        <div id="allmap"></div>
        <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=89772e94509a9b903724e247cbc175c2"></script>
        <script>
	    var map = new BMap.Map("allmap"); // 创建Map实例,设置地图允许的最小/大级别

	    map.centerAndZoom(new BMap.Point(@(Model.AddressResult.Location?.Lng), @(Model.AddressResult.Location?.Lat)), 15);
	    map.enableScrollWheelZoom(true);
	    var new_point = new BMap.Point(@(Model.AddressResult.Location?.Lng), @(Model.AddressResult.Location?.Lat));
	    var marker = new BMap.Marker(new_point); // 创建标注
	    map.addOverlay(marker); // 将标注添加到地图中
	    marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
	    map.panTo(new_point);
        </script>
    }
</div>